<!-- first -->
<ul class="nav">
  <li class="hidden-folded padder m-t m-b-sm text-muted text-xs">
    <span translate="aside.nav.HEADER">Utilitarios</span>
  </li>
  
  <li ui-sref-active="active">
    <a ui-sref="app.mail.list">
      <b class="badge bg-info pull-right">9</b>
      <i class="glyphicon glyphicon-envelope icon text-info-lter"></i>
      <span class="font-bold" translate="aside.nav.EMAIL">Email</span>
    </a>
  </li>
  
  <li ui-sref-active="active">
    <a ui-sref="app.mail.list">
      	<i class="icon-question icon"></i>
      	<span translate="aside.nav.your_stuff.DOCUMENTS">Documentação</span>
    </a>
  </li>
  
  <li class="line dk"></li>

  <li class="hidden-folded padder m-t m-b-sm text-muted text-xs">
    <span translate="aside.nav.components.COMPONENTS">Menu</span>
  </li>
  <li ng-class="{active:$state.includes('app.layout')}">
    <a href class="auto">      
      <span class="pull-right text-muted">
        <i class="fa fa-fw fa-angle-right text"></i>
        <i class="fa fa-fw fa-angle-down text-active"></i>
      </span>
      <b class="badge bg-info pull-right">3</b>
      <i class="glyphicon glyphicon-th"></i>
      <span>Cadastros</span>
    </a>
    <ul class="nav nav-sub dk">
      <li class="nav-sub-header">
        <a href>
          <span>Cadastros</span>
        </a>
      </li>
      <li ui-sref-active="active">
        <a ui-sref="layout.app">
          <span>Usuário</span>
        </a>
      </li>      
    </ul>
  </li>
 
</ul>
<!-- / third -->